<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>回顾Object.defineProperty(）</title>
        <script type="text/javascript" src="../js/vue.js"></script>
    </head>

    <body>
        <div id="root">
        </div>
        <script type="text/javascript">
            let number = 18
            let person = {
                name:'杨七',
                sex:'男',
                // age:26
            }

            //给对象定义属性
            Object.defineProperty(person,'age',{
                // value:25,//属性值
                // enumerable:true,//控制属性是否可以枚举,默认值为false
                // writable:true,//控制属性是否可以被修改,默认值为false
                // configurable:true//控制属性是否可以被删除,默认值为false
                // 当有人读取person的age的属性值时,getter函数将会被调用,且返回值是age的属性值
                get:function() {
                    console.log('有人读取age属性了')
                    return number
                },

                // 当有人修改person的age的属性值时,setter函数将会被调用,且会收到age的具体值
                set:function(value){
                    console.log('有人修改了age属性,且值是',value)
                    number = value
                }
            })

            console.log(person)
            // console.log(Object.keys(person))//获取对象的key数组
        </script>

    </body>
</html>